<template>
    <div>
        <div class="c_box2">
           <div class="c_navbar">
            <p>讨论区</p>
           </div>
           <div class="c_content">
             <el-button type="text" @click="open" class="t_k_btn">新建话题</el-button>
             <div class="t_k_text">
                <ul>
                    <li @click="godetail()" class="t_k_question">你知道计算三重积分的一般步骤是</li>
                </ul>
             </div>
           </div>
        </div>
    </div>
</template>

<script>
export default{
    name:'Test',
    data(){
        return{
          total:10,
          pageSize:5,
          textarea:''
        }
    },
    components:{
    },
    methods: {
     godetail(){
       this.$router.push('/talk')
     },
     open() {
        this.$prompt('请输入话题', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(({ value }) => {
          this.$message({
            type: 'success',
            message: '你的题目是: ' + value
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          });       
        });
      }

    }
}
</script>

<style lang="scss" scoped>
    .c_box2{
        width: 100%;
        min-height: 800px;
        height: auto;
        background-color: white;
        border-radius: 20px;
        .c_navbar{
            width: 100%;
            height: 50px;
            border-bottom: 1px solid #ccc;
            p{
               transform: translate(30px,25px);
               font-size: 20px;
            }
        }
        .c_content{
            width: 100%;
            height: 80%;
            margin-top: 2%;
            box-sizing: border-box;
            .t_k_btn{
              padding-left:40px;
              margin-bottom: 20px;  
            }
            .t_k_text{
              width:100%;
              padding: 0 40px;
              li{
                width: 90%;
                height: 40px;
                line-height: 40px;
                font-size: 18px;
                font-weight: bold;
                border: 1px solid #ccc;
                border-radius: 10px;
                margin-bottom: 25px; 
                padding-left: 10px;
                cursor: pointer;
              }
            }
    }
}
</style>
